package com.promise.jokerdream.ui.components

import androidx.compose.foundation.layout.*
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.clickable
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.promise.jokerdream.ui.components.RoundCheckbox
import com.promise.jokerdream.ui.theme.AppColors
import com.promise.jokerdream.ui.theme.AppFontSizes
import com.promise.jokerdream.ui.theme.AppSpacing

/**
 * 设置卡片组件
 */
@Composable
fun SettingCard(
    modifier: Modifier = Modifier,
    title: String,
    description: String,
    content: @Composable () -> Unit,
    checked: Boolean,
    onCheckedChange: (Boolean) -> Unit,
    onExecuteClick: (() -> Unit)? = null
) {
    Card(
        modifier = modifier
            .fillMaxWidth()
            .padding(horizontal = AppSpacing.cardHorizontal, vertical = AppSpacing.cardVertical),
        shape = RoundedCornerShape(AppSpacing.cardRadius),
        colors = CardDefaults.cardColors(
            containerColor = Color.White
        ),
        elevation = CardDefaults.cardElevation(
            defaultElevation = 2.dp
        )
    ) {
        Column(
            modifier = Modifier
                .fillMaxWidth()
                .padding(AppSpacing.cardPadding)
        ) {
            // 标题行
            Row(
                modifier = Modifier.fillMaxWidth(),
                verticalAlignment = Alignment.CenterVertically,
            ) {
                // 左侧：可点击的标题区域
                Row(
                    modifier = Modifier
                        .weight(1f)
                        .clickable { onCheckedChange(!checked) },
                    verticalAlignment = Alignment.CenterVertically,
                    horizontalArrangement = Arrangement.spacedBy(AppSpacing.componentMedium)
                ) {
                    // RoundCheckbox
                    RoundCheckbox(
                        checked = checked,
                        onCheckedChange = onCheckedChange
                    )
                    
                    Text(
                        text = title,
                        fontSize = 16.sp,
                        fontWeight = FontWeight.SemiBold,
                        color = MaterialTheme.colorScheme.onSurface
                    )
                    
                    // 描述（可选）
                    if (description.isNotEmpty()) {
                        Text(
                            text = "($description)",
                            fontSize = 13.sp,
                            color = MaterialTheme.colorScheme.onSurfaceVariant
                        )
                    }
                }
                
                // 右侧：立即执行按钮（固定在右上角）
                ExecuteButton(
                    onExecuteClick = onExecuteClick,
                    title = title
                )
            }
            
            // 内容区域
            Spacer(modifier = Modifier.height(AppSpacing.componentMedium))
            content()
        }
    }
}

/**
 * 立即执行按钮组件
 */
@Composable
private fun ExecuteButton(
    onExecuteClick: (() -> Unit)? = null,
    title: String
) {
    var showConfirmDialog by remember { mutableStateOf(false) }
    
    Text(
        text = "立即执行",
        fontSize = AppFontSizes.mediumBody,
        fontWeight = FontWeight.Medium,
        color = AppColors.Error,
        modifier = Modifier.clickable { showConfirmDialog = true }
    )
    
    // 确认对话框
    PMAlertDialog(
        show = showConfirmDialog,
        title = "确认执行",
        content = "确定要立即执行「$title」吗？",
        confirmText = "确认",
        cancelText = "取消",
        onDismiss = { showConfirmDialog = false },
        onConfirm = {
            showConfirmDialog = false
            onExecuteClick?.invoke()
        }
    )
}

/**
 * 通用的复选框选项行
 */
@Composable
fun CheckboxOptionRow(
    title: String,
    checked: Boolean,
    onCheckedChange: (Boolean) -> Unit,
    modifier: Modifier = Modifier,
    desc: String = "",
    textStyle: TextStyle = TextStyle(
        fontSize = AppFontSizes.mediumBody,
        fontWeight = FontWeight.Medium,
        color = MaterialTheme.colorScheme.onSurface
    )
) {
    Row(
        modifier = modifier
            .fillMaxWidth()
            .clickable { onCheckedChange(!checked) }
            .padding(vertical = AppSpacing.componentSmall),
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.spacedBy(AppSpacing.componentMedium)
    ) {
        RoundCheckbox(
            checked = checked,
            onCheckedChange = onCheckedChange
        )
        
        Text(
            text = title,
            style = textStyle
        )
        
        // 描述（可选）
        if (desc.isNotEmpty()) {
            Text(
                text = "($desc)",
                fontSize = 13.sp,
                color = MaterialTheme.colorScheme.onSurfaceVariant
            )
        }
    }
}

/**
 * 带文本输入的设置卡片
 */
@Composable
fun TextInputSettingCard(
    modifier: Modifier = Modifier,
    title: String,
    description: String,
    value: String,
    onValueChange: (String) -> Unit,
    placeholder: String = "",
    checked: Boolean,
    onCheckedChange: (Boolean) -> Unit,
    onExecuteClick: (() -> Unit)? = null
) {
    SettingCard(
        title = title,
        description = description,
        checked = checked,
        onCheckedChange = onCheckedChange,
        modifier = modifier,
        onExecuteClick = onExecuteClick,
        content = {
            OutlinedTextField(
                value = value,
                onValueChange = onValueChange,
                placeholder = { Text(placeholder) },
                modifier = Modifier.fillMaxWidth(),
                singleLine = true
            )
        }
    )
}
